<template>
	<!-- 添加档案 -->
	<view class="addArchives-main">
		<uni-forms :modelValue="formData">
			<uni-forms-item label="姓名" name="name" required :label-width="90">
				<uni-easyinput type="text" v-model="formData.name" placeholder="请输入姓名" />
			</uni-forms-item>
			<uni-forms-item label="手机号" name="phone" required :label-width="90">
				<uni-easyinput type="tel" v-model="formData.phone" placeholder="请输入手机号" />
			</uni-forms-item>
			<uni-forms-item label="性别" name="sex" required :label-width="90">
				<uni-data-checkbox v-model="formData.sex" :localdata="sexs" />
			</uni-forms-item>
			<uni-forms-item label="出生日期" name="birth_date" required :label-width="90">
				<view class="dateBox" @click="show = true">
					<text v-if="formData.birth_date">{{ formatDate(formData.birth_date) }}</text>
					<text v-else style="color: #999">请选择出生日期</text>
				</view>
			</uni-forms-item>
			<uni-forms-item label="身份证" name="idcard" required :label-width="90">
				<uni-easyinput type="text" v-model="formData.idcard" placeholder="请输入身份证" />
			</uni-forms-item>
			<uni-forms-item label="血型" name="blood_type" required :label-width="90">
				<uni-data-checkbox v-model="formData.blood_type" :localdata="bloodTypes" />
			</uni-forms-item>
			<uni-forms-item label="药物过敏史" name="history_of_drug_allergies" :label-width="90">
				<uni-easyinput type="text" v-model="formData.history_of_drug_allergies" placeholder="请输入药物过敏史" />
			</uni-forms-item>
			<uni-forms-item label="有无疾病史" name="history_of_illness" :label-width="90">
				<uni-easyinput type="text" v-model="formData.history_of_illness" placeholder="请输入有无疾病史" />
			</uni-forms-item>
			<uni-forms-item label="有无遗传病" name="is_there_any_genetic_disease_present" :label-width="90">
				<uni-easyinput type="text" v-model="formData.is_there_any_genetic_disease_present" placeholder="请输入有无遗传病" />
			</uni-forms-item>
			<uni-forms-item label="有无残疾" name="whether_there_is_a_disability_or_not" :label-width="90">
				<uni-easyinput type="text" v-model="formData.whether_there_is_a_disability_or_not" placeholder="请输入有无残疾" />
			</uni-forms-item>
		</uni-forms>

		<u-datetime-picker
			ref="datetimePicker"
			:show="show"
			v-model="formData.birth_date"
			mode="date"
			@confirm="show = false"
			@close="false"
		></u-datetime-picker>

		<!-- 新增收货地址提交 -->
		<view class="addAddress-btn" :style="bottomStyle">
			<u-button type="primary" color="red" :text="addressId ? '编辑' : '保存'" shape="circle" @click="getuserHealthSave"></u-button>
		</view>
	</view>
</template>

<script>
import { userHealthSave } from '../../api/home/index.js';
import { validatePhoneNumber,validateIDCard } from '../../utils/tools.js';
export default {
	data() {
		return {
			formData: {
				name: '',
				phone: '',
				sex: 0,
				birth_date: '',
				idcard: '',
				blood_type: 'A',
				history_of_drug_allergies: '',
				history_of_illness: '',
				is_there_any_genetic_disease_present: '',
				whether_there_is_a_disability_or_not: ''
			},
			addressId: null,
			sexs: [
				{
					text: '男',
					value: 0
				},
				{
					text: '女',
					value: 1
				}
			],
			bloodTypes: [
				{
					text: 'A',
					value: 'A'
				},
				{
					text: 'B',
					value: 'B'
				},
				{
					text: 'O',
					value: 'O'
				},
				{
					text: 'AB',
					value: 'AB'
				}
			],
			show: false
		};
	},

	computed: {
		bottomStyle() {
			const systemInfo = uni.getSystemInfoSync();
			const { safeAreaInsets } = systemInfo;
			const bottomSafeAreaHeight = safeAreaInsets.bottom || 0;
			return `padding-bottom: ${bottomSafeAreaHeight ? bottomSafeAreaHeight + 'px' : '20rpx'}`;
		}
	},
	methods: {
		async getuserHealthSave() {
			if(!this.formData.name){
				return uni.showToast({
					title:'姓名不能为空',
					icon:'none'
				})
			}
			if(!this.formData.phone){
				return uni.showToast({
					title:'手机号不能为空',
					icon:'none'
				})
			}
			if(!validatePhoneNumber(this.formData.phone)){
				return uni.showToast({
					title:'手机号格式不正确',
					icon:'none'
				})
			}
			if(!this.formData.idcard){
				return uni.showToast({
					title:'身份证号不能为空',
					icon:'none'
				})
			}
			if(!validateIDCard(this.formData.idcard)){
				return uni.showToast({
					title:'身份证号格式不正确',
					icon:'none'
				})
			}
			if(!this.formData.birth_date){
				return uni.showToast({
					title:'出生日期不能为空',
					icon:'none'
				})
			}
			try {
				this.formData.birth_date = this.formatDate(this.formData.birth_date);
				const resData = await userHealthSave(this.formData);
				uni.showToast({
					title: '添加成功',
					icon: 'none'
				});
				setTimeout(() => {
					uni.navigateBack(-1);
				},500);
			} catch (e) {
				throw Error(e);
			}
		},

		formatDate(dates) {
			if (!dates) {
				return '';
			}
			const date = new Date(dates);
			const year = date.getFullYear();
			const month = String(date.getMonth() + 1).padStart(2, '0');
			const day = String(date.getDate()).padStart(2, '0');
			return `${year}-${month}-${day}`;
		}
	}
};
</script>

<style>
page {
	background-color: #fff;
}
</style>

<style scoped lang="scss">
.addArchives-main {
	box-sizing: border-box;
	padding: 20rpx;
}

.addAddress-btn {
	position: fixed;
	bottom: 0rpx;
	left: 0px;
	width: 100%;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	padding: 0px 20rpx;
	padding-top: 20rpx;
	background-color: #fff;
}

.dateBox {
	height: 35px;
	border: 1px solid #dcdfe6;
	border-radius: 4px;
	color: #444;
	line-height: 35px;
	box-sizing: border-box;
	padding: 0px 10px;
}
</style>
